<template>

<div>
<el-card class="card">
<div><img src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png" alt=""></div>
<div class="title">
<p class="p1">早安，{{$store.state.profile.username}}，祝你开心每一天！</p>
<p class="p2">{{$store.state.profile.username}} | {{$store.state.profile.company}}-总裁办</p>
</div>
</el-card>

<!--  日历-->
<el-row>
  <el-col :span="12"><div class="contain">
<el-calendar v-model="value">
</el-calendar>
</div></el-col>
  <el-col :span="12">
  <el-card class="process">
  <h2>申请流程</h2>
  <el-button>加班离职</el-button>
   <el-button>请假调休</el-button>
    <router-link to="/users/approvals"><el-button>审批列表</el-button></router-link>
     <el-button>我的信息</el-button>
  </el-card></el-col>
</el-row>

</div>
</template>

<script>
export default {

}
</script>

<style lang="less" scoped>
.card{
  width: 100%;
display: flex;
padding: 20px;
  img{
    width: 100px;
    height: 100px;
    border-radius: 50%;
   
  }


.title{
 p{
  padding: 5px 0;
 }
 .p1{
  font-size: 25px;
  color: #303133;
}
.p2{
  font-size: 20px;
  color: #999;
}

}



}

.el-calendar{
  width: 500px;
  height: 700px;
}
.contain{
  width: 100%;
  margin-top: 20px;
}

.process{
  h2{
    padding: 0 0 20px 0;
  }
 margin-top: 20px;
 padding: 0 10px 0;
 el-button{
  
 }
 a{
   padding: 0 5px;
 }
}
</style>